<template>
  <div class="todoapp">
    <TodoHeader></TodoHeader>
    <TodoMain :list="list"></TodoMain>
    <TodoFooter></TodoFooter>
  </div>
</template>

<script>
// 1.0 样式引入
import './styles/base.css'
import './styles/index.css'
// 引入组件
import TodoHeader from './components/TodoHeader'
import TodoMain from './components/TodoMain'
import TodoFooter from './components/TodoFooter'
export default {
  data() {
    return {
      list: [
        { id: 100, name: '睡觉觉', isDone: true },
        { id: 101, name: '敷面膜', isDone: false },
        { id: 102, name: '敲代码', isDone: true }
      ]
    }
  },

  created() {},

  methods: {},
  components: {
    TodoHeader,
    TodoMain,
    TodoFooter
  }
}
</script>

<style scoped>
</style>
